﻿import React, { Component} from 'react';
import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as elementAction from '../../actions/actions.js';
import { Menu, Icon } from 'antd';
const SubMenu = Menu.SubMenu;
const MenuItemGroup = Menu.ItemGroup;
import {Table,Button,Pagination} from 'antd';
const queryString = require('query-string');
import * as wepon from "../../utils/weapon.js"

import {createBrowserHistory,createHashHistory} from 'history'
const history = createHashHistory()

class DataList extends Component {
	constructor(props) {
		super(props);
		const {pageNumber,pageSize,defaultCurrent,total,loading}=this.props;
		this.state = {
			selectedRowKeys: [],
			loading: false,
			defaultCurrent:defaultCurrent,
			current:pageNumber,
			pageSize:pageSize,
			total:total,
			loading:loading,
			limit:true
		}
	}
	start = () => {
		this.setState({ loading: true });
		// ajax request after empty completing
		setTimeout(() => {
			this.setState({
				selectedRowKeys: [],
				loading: false,
			});
		}, 1000);
	}
	componentWillReceiveProps(nextProp){
		this.setState(nextProp);
	}
	handleTableChange(pagination, filters, sorter){
	}
	onSelectChange = (selectedRowKeys) => {
    this.setState({ selectedRowKeys });
  }
	pageChange(pageNumber, pageSize){
		const {field_pagesize,field_pagenumber}=this.props;
		var search={}
		search[field_pagesize]=pageSize;
		search[field_pagenumber]=pageNumber;
		search=queryString.stringify(search);
		history.push({path:history.location.pathname,search:search});
	}
	render() {
		const {loading,selectedRowKeys,current,pageSize,defaultCurrent,total} = this.state;
		const {columns,dataSource,defaultPageSize}=this.props;
		const rowSelection = {
			selectedRowKeys,
			onChange: this.onSelectChange,
		};
		const hasSelected = selectedRowKeys.length > 0;
		return (
			<div className="dataList-wrap">
				<div style={{ marginBottom: 16 }}>
					<Button type="primary" onClick={this.start}
						disabled={!hasSelected} loading={loading}
					>Reload</Button>
					<span style={{ marginLeft: 8 }}>{hasSelected ? `Selected ${selectedRowKeys.length} items` : ''}</span>
				</div>
				<Table rowSelection={rowSelection} columns={columns} dataSource={dataSource}
					onChange={this.handleTableChange}
					rowKey='phone'
					loading={loading}
					pagination={false}
			 	/>
				<div className="pagination-wrap" >
					<Pagination showSizeChanger 
					current={current}
					onChange={this.pageChange.bind(this)} 
					defaultPageSize={wepon.strToNum(defaultPageSize)}
					defaultCurrent={wepon.strToNum(defaultCurrent)} 
					onShowSizeChange={this.pageChange.bind(this)}
					total={wepon.strToNum(total)} />
				</div>
			</div>
		);
	}
}
DataList.defaultProps = {
	defaultCurrent:1,
	defaultPageSize:10,
	total:100,//数据总条数
	data:[],
	field_pagesize:"pageSize",
	field_pagenumber:"pageNumber"
};
export default DataList;
